import React, { Component } from 'react';
import {Popup} from 'antd-mobile'
import FooterAlertMaskList from './FooterAlertMaskList'
import style from './footerAlertMask.scss'

class FooterAlertMask extends Component {
    constructor(props) {
        super(props);
        this.state = {
	        currentIndex: 0  //默认的选择
        };
    }

		componentWillMount(){

		}

		componentDidMount() {

		}

	  componentWillUnmount(){

	  }

		onCurrentIndex(index){
			this.setState({
				currentIndex: index
			})
			  // sessionStorage.setItem("visaCurrentIndex", index);  //缓存选择
		}

    render() {
        return (
            <div className={style.footerAlertBox}>
               <ul className={style.listType}>
	               {
	               	this.props.type == 'visa'?
	               	  this.props.visa.map((e,i)=>{

	               	  	return <FooterAlertMaskList key={i}
		                                              index={i}
		                                              data={e}
		                                              currentIndex={this.state.currentIndex||this.props.visaIndex}
		                                              onCurrentIndex={(index)=>{this.onCurrentIndex(index)}}
		                                              onClick={(name,currentIndex,check,index)=>{this.props.choose(name,currentIndex,check,index)}}


		                  />
	                  }):
		                this.props.type == 'sz'?
			                this.props.szList.map((e,i)=>{

				                return <FooterAlertMaskList key={i}
				                                            index={i}
				                                            data={e}
				                                            currentIndex={this.state.currentIndex||this.props.index}
				                                            onCurrentIndex={(index)=>{this.onCurrentIndex(index)}}
				                                            onClick={(name,currentIndex,check,index)=>{this.props.choose(name,currentIndex,check,index)}}


				                />
			                }):null
	               }
               </ul>
                <div style={{height: '.38rem',background: '#f1f1f1'}}></div>
                <div className={style.btn} onClick={e=>Popup.hide()}>取消</div>
            </div>
        )
    }
}

FooterAlertMask.defaultProps = {
  visa: [{index: 0,currentIndex: 1,check:'free',name:'往来港澳个人旅游再次签注(自由行)'},{index: 1,currentIndex:3,check:'again',name:'往来港澳商务再次签注'},
	       {index: 2, currentIndex:4,check:'spouse',name:'往来港澳夫妻探亲再次签注'},{index: 3, currentIndex:5,check:'sz',name:'深圳非广东户籍往来港澳个人旅游再次签注'}],
	szList: [{index: 0, check: 'permit',name: '持居住证人员'},{index: 1, check: 'college',name: '高校大学生'}],
	visaIndex: 0  //默认的选择
}

export default FooterAlertMask